<template>
	<view class="video-box">
		<video id="myVideo" class="v-video" :src="url" controls @ended="videoEnd"></video>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: '',
			};
		},
		onLoad(obj) {
			this.videoContext = uni.createVideoContext('myVideo');
			if (obj.url) {
				this.url = obj.url;
				// this.$nextTick(() => {
				// 	this.videoContext.play();
				// 	this.videoContext.requestFullScreen();
				// })
			}
		},
		methods: {
			videoEnd() {
				this.videoContext.exitFullScreen()
			},
			// fullscreenchange(e) {
			// 	if (!e.detail.fullScreen) {
			// 		uni.navigateBack()
			// 	}
			// }
		}
	};
</script>

<style scoped lang="scss">
	.video-box {
		width: 100%;
		height: 100vh;
		overflow: hidden;
		padding-top: 50%;
		box-sizing: border-box;
		background-color: #000;

		.v-video {
			width: 100%;
		}
	}
</style>